<page-header [title]="l('Languages')"></page-header>
<nz-card [nzBordered]="false">

  <div class="mb-md">
    <!-- 模糊搜索框 -->
    <!-- <nz-row nzGutter="8">
      <nz-col nzSm="24">
        <nz-form-item>
          <nz-form-control>
            <nz-input-group nzSearch [nzSuffix]="suffixSearchButton">

              <input type="text" nz-input [(ngModel)]="filterText" (keyup.enter)="refresh()" name="filterText"
                [placeholder]="l('SearchWithThreeDot')">
              <ng-template #suffixSearchButton>
                <button nz-button nzType="primary" nzSearch type="submit">
                  <i class="anticon anticon-search"></i>
                </button>
              </ng-template>
            </nz-input-group>
          </nz-form-control>
        </nz-form-item>
      </nz-col>
    </nz-row> -->
  </div>

  <!-- 操作部分 -->
  <nz-row nzGutter="8">
    <nz-col nzMd="24" nzSm="24" class="btn-gutter">
      <button nz-button [nzType]="'primary'" *ngIf="isGranted('Pages.Administration.Languages.Create')"
        (click)="createOrEditLanguage()">
        <i class="anticon anticon-plus"></i>
        <span>
          {{l("CreateNewLanguage")}}
        </span>
      </button>
      <button nz-button [nzType]="'danger'" *ngIf="isGranted('Pages.Administration.Languages.Delete')"
        (click)="batchDelete()">
        <i class="anticon anticon-delete"></i>
        <span>
          {{l("BatchDelete")}}
        </span>
      </button>
    </nz-col>
  </nz-row>



  <!-- 数据部分 -->
  <div class="my-md">
    <nz-alert [nzType]="'info'" [nzShowIcon]="true" [nzMessage]="message">
      <ng-template #message>
        <!-- selectedDataItems.length -->
        <span [innerHTML]="l('GridSelectedXItemsTips',0)"></span>
        <a (click)="restCheckStatus(dataList)" class="ml-md">
          {{l('ClearEmpty')}}
        </a>
        <nz-divider nzType="vertical"></nz-divider>
        <a (click)="refresh()">
          {{l('Refresh')}}
        </a>
      </ng-template>
    </nz-alert>
  </div>

  <!-- 实体的表格内容 -->
  <nz-row class="my-md">
    <!-- <nz-table #ajaxTable [nzData]="dataList" [nzTotal]="totalItems" [nzLoading]="isTableLoading"
      (nzPageIndexChange)="pageNumberChange()" (nzPageSizeChange)="refresh()" [nzShowSizeChanger]="true"
      [nzShowQuickJumper]="true" [nzFrontPagination]="false" [nzShowPagination]="false" [nzNoResult]="noDataTemplate"> -->

      <!-- 暂无数据组件 -->
      <!-- <ng-template #noDataTemplate>
        <no-data></no-data>
      </ng-template> -->
<!--

      <thead (nzSortChange)="gridSort($event)">
        <tr>
          <th nzShowCheckbox [(nzChecked)]="allChecked" [nzDisabled]="allCheckboxDisabled"
            [nzIndeterminate]="checkboxIndeterminate" (nzCheckedChange)="checkAll($event)"></th>
          <th nz-th>
            <span>{{l("Name")}}</span>
          </th>
          <th nz-th>
            <span>{{l("Code")}}</span>
          </th>
          <th nzShowSort nzSortKey="creationTime" class="text-center">
            <span>{{l("CreationTime")}}</span>
          </th>
          <th nzShowSort nzSortKey="isEmailConfirmed" class="text-center">
            <span>{{l("Enabled")}}</span>
          </th>
          <th nzWidth="280px" class="text-center">
            <span>{{l('Actions')}}</span>
          </th>
        </tr>
      </thead> -->
      <!-- 表格内容 -->
      <!-- <tbody nz-tbody>
        <tr *ngFor="let item of ajaxTable.data"> -->
          <!-- 全选框 -->
          <!-- <td nzShowCheckbox [(nzChecked)]="item.checked" (nzCheckedChange)="refreshCheckStatus(dataList)"></td>
          <td nz-td>
            <ellipsis lines="1">
              <span nz-tooltip [nzTitle]="item.displayName">
                <i class="anticon {{item.icon}}"></i>
                {{item.displayName}}
                <span *ngIf="defaultLanguageName === item.name">({{l('Default')}})</span></span>
            </ellipsis>
          </td>
          <td nz-td>
            <ellipsis lines="1">
              <span nz-tooltip [nzTitle]="item.name">
                {{item.name}}
              </span>
            </ellipsis>
          </td>
          <td class="text-center">
            <ellipsis lines="1">
              <span nz-tooltip [nzTitle]="item.creationTime|_date">
                {{item.creationTime|_date}}
              </span>
            </ellipsis>
          </td>
          <td class="text-center" [innerHTML]="!item.isDisabled | yn"> </td>

          <td> -->
            <!-- 编辑 -->
            <!-- <ng-container
              *ngIf="isGranted('Pages.Administration.Languages.Edit') && item.tenantId === appSession.tenantId">
              <a (click)="createOrEditLanguage(item.id)">
                <i class="anticon anticon-edit mr-sm"></i>
                <span>{{l('Edit')}}</span>
              </a>
              <nz-divider nzType="vertical"></nz-divider>
            </ng-container> -->
            <!-- 删除 -->
            <!-- <ng-container
              *ngIf="isGranted('Pages.Administration.Languages.Delete') && item.tenantId === appSession.tenantId">
              <nz-popconfirm [nzTitle]="l('ConfirmDeleteWarningMessage')" (nzOnConfirm)="delete(item)"
                [nzOkText]="l('Ok')" [nzCancelText]="l('Cancel')">
                <a nz-popconfirm>
                  <i class="anticon anticon-delete mr-sm"></i>
                  <span>{{l('Delete')}}</span>
                </a>
              </nz-popconfirm>
            </ng-container>

            <ng-container
              *ngIf="isGrantedAny('Pages.Administration.Languages.ChangeTexts', 'Pages.Administration.Languages.Edit')">
              <nz-divider nzType="vertical"></nz-divider>
              <nz-dropdown [nzTrigger]="'click'">
                <a class="ant-dropdown-link" nz-dropdown>
                  {{l('Actions')}}
                  <i class="anticon anticon-down"></i>
                </a>
                <ul nz-menu>

                  <li nz-menu-item *ngIf="isGranted('Pages.Administration.Languages.ChangeTexts')">
                    <a (click)="changeTexts(item) ">{{l('ChangeTexts')}}</a>
                  </li>
                  <li nz-menu-item *ngIf="isGranted('Pages.Administration.Languages.Edit')">
                    <a (click)="setAsDefaultLanguage(item) ">{{l('SetAsDefaultLanguage')}}</a>
                  </li>

                </ul>
              </nz-dropdown>
            </ng-container>
          </td>
        </tr>
      </tbody>
    </nz-table> -->
  </nz-row>

</nz-card>
